<template>
	<view style="min-height: 100vh;">
		<view class="" style="min-height: 100vh;padding: 0 30rpx;"
			:style="{background:'url('+Imgbase+'/new_goodmy_bgc.png)','background-size':'100%',}">
			<view class="zinde">
				<view class="" style="padding: 105rpx 20rpx 0;position: relative;z-index: 99;" @click="back">
					<image class="w-80 h-80 margin-top-10" :src="Imgbase + '/new_goodlx_img1.png'" mode="aspectFit">
					</image>
				</view>
			</view>

			<view class="w-690 h-1400 margin-auto Afont"
				:style="{background:'url('+Imgbase+'/new_goodwater_bgc.png)','background-size':'100% 100%',}">
				<view class="text-center padding-top-16">
					<image class="w-222 h-50" :src="Imgbase + '/new_goodwater_img2.png'" v-if="TabCur==0"
						mode="aspectFit"></image>
					<image class="w-222 h-50" :src="Imgbase + '/new_goodwater_img3.png'" v-else mode="aspectFit">
					</image>
				</view>

				<scroll-view scroll-y class="w100 h-1350 padding-left-20 padding-top-100" scroll-with-animation
					style="overflow: hidden;">
					<view class="padding" v-show="TabCur == 0">
						<view class="solid-bottom Afont margin-bottom-20 bitem padding-20"
							v-for="(item,index) in moneylist" :key="index"
							:style="{background:'url('+Imgbase+'/new_goodwater_img5.png)','background-size':'100% 100%',}">
							<view class="flex-between">
								<view class="" style="color: #76451F;">
									{{item.createtime_text}}
								</view>
								<view class="" :class="[item.money > 0?'text-green':'text-red']">
									<text v-show="item.money > 0">+</text>{{item.money}}
								</view>
							</view>
							<view class="padding-top-10" style="color: #76451F;">
								操作：{{item.memo}}
							</view>
							<view class=" padding-top-10  " style="color: #76451F;">
								变更前:{{item.before}}
							</view>
							<view class="padding-top-10" style="color: #76451F;">
								变更后:{{item.after}}
							</view>
						</view>

						<view class="padding Afont" style="width: 100%;height: 40upx;margin-bottom: 80rpx;"
							v-if="moneylist.length > 0">
							<view class="action fl">
								<text class="cuIcon-back fl" style="font-size: 34rpx;color: #876d38;"
									@click="pageleft()">上一页</text>
							</view>
							<view class="action fr">
								<text style="font-size: 34rpx;color: #876d38;" @click="pageright()"><text>下一页<text
											class="cuIcon-right"></text></text></text>
							</view>
						</view>
					</view>


					<view class="padding" v-show="TabCur == 1">
						<view class="solid-bottom margin-bottom-20 bitem padding-20" v-for="(item,index) in scorelist"
							:key="index"
							:style="{background:'url('+Imgbase+'/new_goodwater_img5.png)','background-size':'100% 100%',}">
							<view class="flex-between">
								<view class="" style="color: #76451F;">
									{{item.createtime_text}}
								</view>
								<view class="" :class="[item.score > 0?'text-green':'text-red']">
									<text v-show="item.score > 0">+</text>{{item.score}}
								</view>
							</view>
							<view class="padding-top-10" style="color: #76451F;">
								操作：{{item.memo}}
							</view>
							<view class=" padding-top-10  " style="color: #76451F;">
								变更前:{{item.before}}
							</view>
							<view class="padding-top-10" style="color: #76451F;">
								变更后:{{item.after}}
							</view>
							<view style="clear: both;"></view>
							<view class="text-df padding-sm text-ablack" v-if="item.mes != null">
								<view style="width: 20%;height: 130upx;margin-right: 10upx;position: relative;"
									class="fl" v-for="(mes_item,mes_index) in item.mes" :key="mes_index">
									<image :src="mes_item.adimage" mode="aspectFill" style="width: 100%;height: 100%;"
										@click="viewImages(mes_item.adimage)"></image>
									<view class=""
										style="position: absolute;right: 5rpx;top: 5rpx;z-index: 99;color: #FBBD08;font-weight: bold;">
										x{{mes_item.num}}
									</view>
								</view>
							</view>
							<view style="clear: both;"></view>
							<view style="width: 100%;height: 20upx;"></view>
						</view>
					</view>
					<view class="h-100">

					</view>
				</scroll-view>

			</view>
		</view>

		<!-- <view class="padding-top-90 margin-left-40">
			<image @click="back" class="w-60 h-120 margin-right-20" :src="Imgbase + '/kp_setting_back.png'"
				mode="aspectFit"></image>
			<image class="w-240 h-120" :src="Imgbase + '/kp_water_img1.png'" mode="aspectFit"></image>
		</view> -->

		<!-- <view class="padding-40 flex-between h-100 margin-top-50">
			<view class="w-350 text-center">
				<image class="trans" @click="tabSelect(0)" :class="TabCur==0?'w-350 h-120':'w-350 h-120'"
					:src=" Imgbase+'/kp_water_tab1' + [TabCur==0?'_c':''] + '.png'" mode="aspectFit"></image>
			</view>
			<view class="w-350 text-center">
				<image class="trans" @click="tabSelect(1)" :class="TabCur==1?'w-350 h-120':'w-350 h-120'"
					:src=" Imgbase+'/kp_water_tab2' + [TabCur==1?'_c':''] + '.png'" mode="aspectFit"></image>
			</view>
		</view> -->

		<view class="flex-between padding-left-5 padding-right-5 top_item">
			<view class="" :class="[TabCur==0?'item_on':'item_off']" @click="tabSelect(0)">
				余额列表
			</view>
			<view class="" :class="[TabCur==1?'item_on':'item_off']" @click="tabSelect(1)">
				积分记录
			</view>
		</view>

		<!-- <scroll-view scroll-x class=" nav margin-top-100rpx" style="width: 92%;margin-left: 4%;">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="index==TabCur?'text-green cur text-bold':''"
					v-for="(item,index) in tap" :key="index" @tap="tabSelect" :data-id="index">
					{{tap[index]}}
				</view>
			</view>
		</scroll-view> -->


		<view class="cu-modal" :class="modalName=='postwithdraw'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">申请提现</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl">
					<view class="cu-form-group margin-top">
						<view class="title">提现金额</view>
						<input placeholder="请输入要提现的金额" type="number" name="input" v-model="postmoney"></input>
					</view>
				</view>
				<view class="cu-bar bg-white justify-end">
					<view class="action">
						<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
						<button class="cu-btn bg-green margin-left" @tap="sureWithdraw()">确定</button>
					</view>
				</view>
			</view>
		</view>
		<view class="cu-load load-modal" v-if="loadModal">
			<image src="/static/icon.jpg" mode="aspectFit"></image>
			<view class="gray-text">加载中...</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Imgbase: getApp().globalData.Imgbase,
				TabCur: 0,
				//tap:['余额列表','积分记录','余额提现'],
				tap: ['poke币列表', '积分记录'],
				scoreData: true,
				moneyData: true,
				withdrawData: true,
				scorelist: [],
				scorepage: 1,
				scorecount: 0,
				moneylist: [],
				moneypage: 1,
				moneycount: 0,
				withdrawlist: [],
				withdrawpage: 1,
				withdrawcount: 0,
				money: 0,
				postmoney: 0,
				modalName: null,
				last: 0,
				loadModal: false,
			};
		},
		onLoad(options) {
			this.TabCur = options.id
			this.init();
		},
		onShow() {},
		onChooseAvatar(e) {
			// const { avatarUrl } = e.detail 
			// this.setData({
			//   avatarUrl,
			// })
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			pageleft() {
				if (this.moneypage == 0) {
					uni.showToast({
						icon: 'none',
						title: '已经是第一页了',
					});
					return;
				}
				this.moneypage -= 1;
				this.moneyList(this.did)
			},
			pageright() {
				if (this.moneypage == this.lastlogcount - 1) {
					uni.showToast({
						icon: 'none',
						title: '已经是最后一页了',
					});
					return;
				}
				this.moneypage += 1;
				this.moneyList(this.did)
			},
			viewImages(adimages) {
				let images = [];
				images = images.concat(adimages);
				uni.previewImage({
					urls: images,
					current: 0
				});
			},
			init() {
				this.scorelist = [];
				this.scorepage = 1;
				this.scorecount = 0;
				this.scoreData = true;
				this.moneylist = [];
				this.moneypage = 1;
				this.moneycount = 0;
				this.moneyData = true;
				this.withdrawlist = [];
				this.withdrawpage = 1;
				this.withdrawcount = 0;
				this.withdrawData = true;
				if (this.TabCur == 1) {
					this.scoreList();
				} else {
					this.moneyList();
				}
				//this.withdrawList();
				this.getuser();
				this.getlast();
			},
			getuser() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Userways/userFront',
					data: {
						token: uni.getStorageSync('token'),
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.money = res.data.data.user_desc.money;
						}
					}
				});
			},
			getlast() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Userways/userCouldWithdraw',
					data: {
						token: uni.getStorageSync('token'),
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.last = res.data.data.last;
						}
					}
				});
			},
			tabSelect(e) {
				console.log(e)
				this.TabCur = e
				if (this.TabCur == 1) {
					this.scoreList();
				} else {
					this.moneyList();
				}
			},
			scoreList() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Userways/scoreLog',
					data: {
						token: uni.getStorageSync('token'),
						page: _this.scorepage,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.scorecount = res.data.data.count;
							for (let i = 0; i < res.data.data.list.length; i++) {
								res.data.data.list[i].mes = JSON.parse(res.data.data.list[i].data);
								_this.scorelist = _this.scorelist.concat(res.data.data.list[i])
							}
							if (_this.scorelist.length >= _this.scorecount) {
								_this.scoreData = false
							}
						}
						if (res.data.code == '0') {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					}
				});
			},
			moneyList() {
				let _this = this;
				_this.loadModal = true;
				uni.request({
					url: _this.$globals.apibase + '/api/Userways/moneyLog',
					data: {
						token: uni.getStorageSync('token'),
						// token: 'a487340d-56fd-4a0d-a2c9-5898f7ddd28e',
						page: _this.moneypage,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.moneycount = res.data.data.count;
							for (let i = 0; i < res.data.data.list.length; i++) {
								if (res.data.data.list[i].data != '') {
									res.data.data.list[i].mes = JSON.parse(res.data.data.list[i].data);
								}
								// _this.moneylist = _this.moneylist.concat(res.data.data.list[i])
							}
							if (_this.moneylist.length >= _this.moneycount) {
								_this.moneyData = false
							}
							_this.moneylist = res.data.data.list
						}
						if (res.data.code == '0') {

							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
						_this.loadModal = false;
					},
				});
			},
			withdrawList() {
				let _this = this;
				uni.request({
					url: _this.$globals.apibase + '/api/Usersys/withdrawalLog',
					data: {
						token: uni.getStorageSync('token'),
						page: _this.withdrawpage,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							_this.withdrawcount = res.data.data.count;
							for (let i = 0; i < res.data.data.list.length; i++) {
								_this.withdrawlist = _this.withdrawlist.concat(res.data.data.list[i])
							}
							if (_this.withdrawlist.length >= _this.withdrawcount) {
								_this.withdrawData = false
							}
						}
						if (res.data.code == '0') {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					}
				});
			},
			hideModal(e) {
				this.modalName = null
			},
			withdrawal() {
				this.modalName = 'postwithdraw';
			},
			sureWithdraw() {
				let _this = this;
				if (this.postmoney < 1) {
					uni.showToast({
						icon: 'none',
						title: '提现金额不能小于1元!'
					});
					return;
				}
				if (parseFloat(this.postmoney) > parseFloat(this.money)) {
					uni.showToast({
						icon: 'none',
						title: '提现金额不能超过现有余额!'
					});
					return;
				}
				if (parseFloat(this.postmoney) > parseFloat(this.last)) {
					uni.showToast({
						icon: 'none',
						title: '提现金额不能超过今日额度!'
					});
					return;
				}
				uni.request({
					url: _this.$globals.apibase + '/api/Usersys/postWithdrawal',
					data: {
						token: uni.getStorageSync('token'),
						money: _this.postmoney,
					},
					method: 'POST',
					header: {
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.data.code == '401') {
							uni.setStorageSync('token', '');
							_this.$uniApi.trylogin();
						}
						if (res.data.code == '1') {
							uni.showToast({
								icon: 'none',
								title: '申请成功!',
								duration: 5000,
							});
							_this.getuser();
							this.modalName = null,
								_this.init();
						}
						if (res.data.code == '0') {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					}
				});
			},
		},
		// onReachBottom() {
		// 	if (this.moneyData) {
		// 		this.moneypage++;
		// 		this.moneyList();
		// 	}
		// 	if (this.scoreData) {
		// 		this.scorepage++;
		// 		this.scoreList();
		// 	}
		// 	/*if (this.withdrawData) {
		// 		this.withdrawpage++;
		// 		this.withdrawList();
		// 	}*/
		// },
	}
</script>

<style lang="less" scoped>
	.top_item {
		background-color: #fff;
		width: 90%;
		margin: 50rpx auto 0;
		font-size: 30rpx;

		.item_on {
			width: 47%;
			color: #39B54A;
			height: 90rpx;
			text-align: center;
			line-height: 90rpx;
			font-weight: bold;
			border-bottom: 4rpx solid #39B54A;
		}

		.item_off {
			width: 47%;
			height: 90rpx;
			text-align: center;
			line-height: 90rpx;
			border-bottom: 4rpx solid #fff;
		}
	}


	.trans {
		transition: .1s;
	}

	.fl {
		float: left;
	}

	.fr {
		float: right;
	}
</style>